$(function () {
  // 获取裁剪区域的DOM元素
  var layer = layui.layer;
  var $image = $("#image");
  // 配置选项
  const options = {
    // 纵横比
    aspectRatio: 1,
    //指定预览区域
    preview: ".img-preview",
  };
  // 创建裁剪区域
  $image.cropper(options);

  // 给上传按钮绑定点击事件
  $(".btnChooseImage").on("click", function () {
    $("#file").click();
  });

  $("#file").on("change", function (e) {
    // 获取用户选择的文件
    // var layer = layui.layer;
    // var filelist = e.target.files;
    // if (filelist.length === 0) {
    //   return layui.layer.msg("请选择照片！");
    // }
    // var file = e.target.files[0],
    //   newImgUrl = URL.createObjectURL(file);
    // $image.cropper("destroy").attr("src", newImgUrl).cropper(options);
  });
  // 为确定按钮绑定事件
  $(".btnQ").on("click", function () {
    var dataURL = $image
      .cropper("getCroppedCanvas", {
        width: 100,
        height: 100,
      })
      .toDataURL("image/png");
    $.ajax({
      method: "POST",
      url: "/my/update/avatar",
      data:{
        avatar: dataURL
      },
      success: function (res) {
        console.log(res);
        if (res.status !== 0) {
          return layer.msg("更新头像失败");
        }
        layer.msg("更新头像成功");
      },
    });
    window.parent.getUserInfo();
    // localStorage.setItem("data", dataURL);
  });
});
